/************************************************************************************************************
	RESET
 ************************************************************************************************************/
html, body, ul, li, h1, h2, h3, h4 {
    padding: 0;
    margin: 0;
}
ul, li {
    list-style: none;
}
img {
    border: 0 none;
}
/* new clearfix */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

html {	
	font-size:10px;
	direction: rtl;
}
	body {
		font-family: Arial;
	}

@media all and (max-width: 480px) {
    body {
        width: 100%;
    }
		#container {
			width: 100%;
		}
}

/* HEADER */
#header {
	font-size: 2.1em;
}
	#banners {
		background: url('../Images/backgrounds.sprite.png') 0 0 repeat-x #3f3f3f;
		padding: 9px 0;
		text-align: center;
	}
		#header .banner 
		{
		    /*width:46%;*/
			display: inline-block;
			/*height: 65px;*/
			margin: 0 4px;
			text-decoration: none;
		}
		#header .banner:only-child img {
			/*width: 230px;
			height: 50px;*/
		}
		#header .banner img {
			/*width: 115px;
			height: 50px;*/
		}

    /** Breadcrumbs Navigation **/
    #header #bcnav {
        background: url('../Images/backgrounds.sprite.png') left -100px repeat-x;
        height: 86px;
        position: relative;
		margin-bottom: -9px;
    }
		#bcnav #orange {
			display: block;
			width: 52px;
			height: 52px;
			position: absolute;
			top: 12px;
			right: 12px;
			background: url('../Images/menu.sprite.png') 0 -300px no-repeat;
			text-indent: -999em;
			overflow: hidden;
		}		
		#header #bcnav.searchOpened ul {
			display: none;
		}
		#header #bcnav  ul {
			display: block;
			background: url('../Images/menu.sprite.png') top left no-repeat;
			padding: 12px 65px 12px 0;
			height: 63px;
		}
			#header #bcnav li {
				float: right;
				background: url("../Images/menu.sprite.png") left -100px no-repeat;
				height: 53px;
			}
				#header #bcnav li:last-child {
					background-position: left -200px;
				}
				
				#header #bcnav li a {
					display: block;
					height: 52px;
					padding: 0 10px 0 20px;
					line-height: 50px;
					text-decoration: none;
					color: #fff;
				}
		#bcnav .hide {
			visibility: hidden;
		}

    /** Search **/
    #search {
        position: absolute;
        top: 12px;
        z-index: 30;
		height: 53px;
		overflow: hidden;		
		/* State: CLOSED */
		left: 9px;
		width: 53px;		
		direction: ltr;
    }
        #search #button {
            display: block;
            width: 53px; height: 53px;
            overflow: hidden;
            text-indent: -999em;
            position: absolute;
            top: 0; left: 0;
			z-index: 35;
			background: url("../Images/search.png") 100% 0 no-repeat;
        }
		
        #search input {
			color: #000;
			direction: rtl;
			background: transparent;
			height: 50px;
			width: 458px;
			position: absolute;
			left: -500px; top: 0;
			border: none;
			background: url("../Images/search.png") 0 -100px repeat-x;
			border-bottom-right-radius: 5px;
			border-top-right-radius: 5px;
        }
        
	#search.opened {
		width: 468px;
		x-webkit-transition: all 3000ms;
		xtransition: all 300ms;
	}
		#search.opened input {
			width: 408px;
			left: 50px;
		}
	
	#search.closed input {
		left: -500px;
	}

	@media all and (min-width: 481px) {
		#search {
			/* State: NORMAL */
			width: 250px;
		}	
			#search input {
				width: 200px;
				left: 50px;
			}
	}
	
/** Optional 4th level title **/
h1 {
	background: url("../Images/backgrounds.sprite.png") left -1090px repeat-x;
	line-height: 50px;
	font-size: 2.5em; /*25px*/	
	font-weight: normal;
	color: #fff;
	text-shadow: #000 1px 1px 1px;
	padding-right: 12px;
}
/** Top Navigation Tabs **/
#toptabs {    
    height: 65px;
    font-size: 2.1em;
    background: url("../Images/tabs.png") 0 0 repeat-x;
    position: relative;
    margin-bottom: -12px;
}
    #toptabs li {
        float: right;
        width: 33.3%;
        height: 65px;
    }        
        #toptabs li a {
            display: block;
            line-height: 52px;
            color: #FFF;
            font-weight: bold;
            text-align: center;
            text-decoration: none;
			background: url("../Images/tabs.png") 0 -200px no-repeat;	
			text-shadow: #676767 1px 1px 1px;
        }

    #toptabs li.active {
        background: 
			url("../Images/tabs.png") 50% -400px no-repeat,
			url("../Images/tabs.png") 0 -100px repeat-x;
    }
		#toptabs li.active a {
			text-shadow: #d97124 1px 1px 1px;	
			background: url("../Images/tabs.png") 0 -300px no-repeat;					
		}

		#toptabs li:last-child a {
			background: none;
		}
		
/** Footer **/
#footer {
   background: url("../Images/footer.png") 0 0 repeat-x;
   overflow: hidden;
   font-size: 2em;
}
    #footer a {
        float: left;
        width: 49.8%;
        height: 60px;        
		background: url("../Images/footer.png") 0 -100px no-repeat;
		color: #FFF;
		text-decoration: none;
		text-align: center;
		text-shadow: #676767 1px 1px 1px;
		font-weight: bold;
        line-height: 60px;
    }
		#footer a:first-child {
			background: none;
		}

.banner {
	text-align: center;
}
#content .banner {
	padding-bottom: 30px;
	border-bottom: 1px solid #bdbdbd;
}

/** Recurring Elements **/
#content h2 {
    background: url("../Images/backgrounds.sprite.png") left -200px repeat-x;
    height: 60px;
    line-height: 50px;
    text-indent: 0.5em;
    padding: 0;
    margin: 30px 0 -10px;
    font-size: 1.15em; /*24px*/
    direction: rtl;
    color: #ff6501;
    font-weight: normal;
	position: relative;
}	
	/* First title on page after breadcrumbs*/
	#content h2.alt {
		margin-top: 0;		
	}	
	#content h2.alt2 {
		background-image: url("../Images/title-bg-alt1.png");
	}
	#content h2.more-button {
		height: 91px;
		line-height: 91px;
		background: url("../Images/backgrounds.sprite.png") left -1152px repeat-x;
		margin-bottom: 30px;
	}
		#content h2.more-button a {			
			display: block;
			color: #ff6501;
			text-decoration: none;
			text-align: center;
		}
			#content .round-button {
				background: url("../Images/buttons.sprite.png") left -320px no-repeat;
				width: 38px;
				height: 38px;
				display: inline-block;
				vertical-align: middle;
				margin: -5px 5px 0 0;
			}
#content p {
	font-size: 1.05em; /*22px*/
	color: #494949;
	padding: 0 0.5em;
}
	#content p a {
		color: #494949;
		font-weight: bold;
		text-decoration: none;
	}
#content table {
	margin: 0.5em 0.5em 0 0.5em;
	text-align: right;
}
.info {	
	padding-bottom: 1.2em;
	background: url("../Images/item-bg.png") bottom left repeat-x #FFF;
	color: #494949;	
}
	.info th {		
		font-weight: normal;
	}
	.info td {		
		font-weight: bold;
	}
.note {
	background-color: #eaeaea;
	margin-top: 30px;
	padding: 10px 0 15px;
}
.bottom-note 
{
    font-size: 2.1em;
    line-height: 1.25em;
    color:#494949;
	background-color: #eaeaea;
	margin-top: 30px;
	margin-bottom: 20px;
	padding: 10px 0 15px;
}
.bottom-note a
{
    color:#494949;
}

.orange-note {
	color: #ff6600;
	padding-left: 4em;
	font-size: 1.05em;
}
.bottom-note p,
.note p {
	margin: 0;
}

#content th {
	padding-left: 0.5em;
}
.pt {
	padding-top: 1.5em;
}

/** Effects and Other Veggies **/
.inset {
    text-shadow: rgba(0,0,0,0.5) -1px 0, rgba(0,0,0,0.3) 0 -1px, rgba(255,255,255,0.5) 0 1px, rgba(0,0,0,0.3) -1px -2px;
}
.whitebg {
    background: #FFF;
}

/** Content **/
#content {
    background-color: #fff;
    font-size: 2.1em;
    line-height: 1.25em;
}
#content h3 {
	font-size: 1.2em;
}
/** Grid and Glowing Grid **/
.glowgrid {
    background:
        url("../Images/sep-v.png") 33.3% top no-repeat,
        url("../Images/sep-v.png") 66.6% top no-repeat,
        url("../Images/sep-h.png") 50% top repeat-y,
        url("../Images/row-glow.png") 50% top repeat-y;
        background-size:
            2px 100%,
            2px 100%,
            100% 82px,
            100% 82px;
}
.glowgrid.t2 {
    background:
        url("../Images/sep-v.png") 33.3% 0px no-repeat,
        url("../Images/sep-v.png") 66.6% 0px no-repeat,
        url("../Images/sep-h.png") 50% top repeat-y,
        url("../Images/row-glow.png") 50% top repeat-y;
        background-size:
            2px 300%,
            2px 300%,
            100% 60px,
            100% 60px;
}
    .glowgrid li {
        float: right;
        width: 33.3%;
        height: 60px;
        text-align: center;
        font-size: 0.95em; /* 20px */
    }
    .glowgrid li a {
        display: block;
		height: 100%;
		line-height: 60px;
        color: #000;
        text-decoration: none;
    }
		.glowgrid li:hover {
			background: transparent url("../Images/row-glow-hover.png") -3px -2px no-repeat;
			background-size: 100% 60px;
		}
/** Items Listing **/
ul.items {

}
    #current-item,
    ul.items li {
        background: url("../Images/items.png") 100% 100% no-repeat #FFF;
        direction: rtl;
    }
    .items li.financed {
        background: url("../Images/items.png") 0 100% no-repeat #f0f0f0;
    }
		#current-item .item,
		ul.items li .item {
			text-decoration:none;
			display: block;
			padding: 15px 12px;
			overflow: hidden;
			position: relative;
		}
		
		ul.items li:first-child .item {
			padding-top: 20px; /* 5px compensation for tab's negative mmargin-bottom */
		}
		
		ul.items li.detail p {
			color: #4B4B4B;
			padding: 0;
			margin: 0;
		}
	#current-item img,
    .items img {
        width: 5em;
        height: 5em;
        float: right;
        margin-left: 1.5em;
		border: 1px solid #c5c5c5;
    }
	#current-item h3,
    .items h3 {
        color: #000;
        line-height: 1em;
    }
    .details {		
		padding-left: 4em;
		font-size: 1.05em;
		height: 2.5em;
		overflow: hidden;
    }
	#current-item .details,
	#current-item .price,
    .items .details,
    .items .price {
        color: #494949;
        display: block;
    }
	.items .detail {
		padding: 10px;
	}
    .items .like {
        position: absolute;
        background: url("../Images/actionable.png") top left no-repeat;
        height: 1.2em;
        padding: 0 0 0 30px;
        top: 2.5em; left: 0.5em;
        font-size: 1.05em;
        color: #3B5998;
    }
    .items .sponsored {
        height: 1.2em;
        font-size: 0.95em;
        color: #F60;
        display: block;
        position: absolute;
        bottom: 1em; left: 0.5em;    
    }
    .items .pick {
        background: url("../Images/actionable.png") bottom left no-repeat;
        height: 1.2em;
        padding: 0 0 0 36px;
        font-size: 0.95em;
        color: #F60;
        display: block;
        position: absolute;
        bottom: 1em; left: 0.5em;
    }
    .items .financed .pick {
    	background: none;
    	color: #494949;
    	padding-left: 0;
    	font-weight: normal;
    }

/** Simple List **/
    .simplelist li {
        background: url("../Images/item-bg.png") bottom left repeat-x #FFF;
        direction: rtl;
    }
        .simplelist li a {
            background: url("../Images/li.png") 1em 50% no-repeat;
            display: block;
            font-size: 1.2em;
            color: #000;
            text-decoration: none;
            line-height: 2.6em;
			padding: 0.45em 0.45em 0.5em 0.5em;
        }
        .simplelist li:first-child a {
			padding-top: 0.1em;
        }
		.simplelist li img {
			float: right;
			width: 2.5em;
			height: 2.5em;
			margin-left: 0.8em;
			border: 1px solid #c5c5c5;
		}

/* Item Page */
#current-item .button {
	display: block;
	width: 222px;
	height: 47px;
	margin-right: 5.5em;
	background: url("../Images/buttons.sprite.png");
	text-align: center;
	color: #fff;
	font-size: 2.1em;
	font-weight: bold;
	line-height: 47px;
	text-shadow: #cf5d14 1px 1px 1px;
}
	#facebook {
		color: #fff;
		padding-right: 120px;
		background: url("../Images/buttons.sprite.png") 100% -182px no-repeat #3b5998;
		position: relative;
	}
		#facebook  p {
			margin: 0.5em 0;
			padding: 0.5em 0;
			color: #fff;
			line-height: 0.9em;
		}
		#facebook .share, 
		#facebook .like {
			display: block;
			width: 101px;
			height: 41px;
			position: absolute;
			top: 10px;
			left: 10px;
			background: url("../Images/buttons.sprite.png") 0 -250px no-repeat;
			font-size: 0.85em; /*18px*/
			font-weight: bold;
			line-height: 40px;
			color: #3b5998;
			text-align: center;
			text-decoration: none;
		}
		#facebook .like {
			background: url("../Images/buttons.sprite.png") -150px -250px no-repeat;
			text-align: right;
			text-indent: 15px;
			left: 115px;
		}

	#itemtabs li {
		float: right;
		width: 50%;
		text-align: center;		
	}	
	#itemtabs h2 {
		color: #494949;
		text-shadow: #b8b8b8 1px 1px 1px;
		background: url("../Images/backgrounds.sprite.png") left -1010px repeat-x #FFF;
		margin-top: 0;
	}
	#itemtabs .active h2 {		
		color: #FF6501;
		text-shadow: none;
		background: 
			url("../Images/tab-pointer.png") center 49px no-repeat,
			url("../Images/backgrounds.sprite.png") left -200px repeat-x;
		padding-bottom: 1px;
	}

.download-button {
	display: block;
	width: 334px;
	height: 62px;
	background: url("../Images/buttons.sprite.png") 0 -100px no-repeat;
	text-align: center;
	color: #fff;
	font-size: 1.3em; /*28px*/
	font-weight: bold;
	line-height: 62px;
	text-shadow: #cf5d14 1px 1px 1px;	
	text-decoration: none;
	margin: 0.75em auto;
}
.back-button {
	display: block;
	width: 421px;
	height: 62px;	
	line-height: 62px;
	background: url("../Images/buttons.sprite.png") 0 -400px no-repeat;
	text-align: center;
	font-size: 2.5em;
	color: #494949;
	margin: 30px auto 30px;
	text-decoration: none;
	text-indent: 40px;
}

#screenshots,
#videos {
	padding: 27px 0;
	overflow: hidden;
	background: url("../Images/item-bg.png") bottom left repeat-x #FFF;
}

/* Carousel, Video */
.carousel, .video {
	display: block;
	margin: 0 auto;
}
.video {
	width: 372px;
	height: 209px;
	border: 1px solid #c5c5c5;
}
.carousel {
	background: url("../Images/carousel.sprite.png") center top no-repeat;	
	width: 212px;
	height: 300px;
	position: relative;
	text-align: center;	
}
	.carousel .wrapper {
		display: block;
		width: 212px;
		height: 250px;
		overflow: hidden;
		position: relative;
		right: 1px;
		top: 2px;
		margin-bottom: 24px;
	}
		.carousel .images {
			position: absolute;
			left: 0;
			top: 0;
		}
			.carousel li {
				float: left;
			}
				.carousel li img {
					display: block;
					width: 212px;
					height: 250px;
				}
		.carousel .arr-right,
		.carousel .arr-left {
			display: block;
			width: 42px;
			height: 47px;	
			position: absolute;
			top: 100px;	
			background: url("../Images/carousel.sprite.png") -50px -300px no-repeat;
		}
		.carousel .arr-right {
			background-position: 0 -300px;
			right: -80px;
		}
		.carousel .arr-right.disabled {
			background-position: 0 -350px;
		}
		.carousel .arr-left {
			background-position: -50px -300px;
			left: -80px;
		}
		.carousel .arr-left.disabled {
			background-position: -50px -350px;
		}
		.carousel #bullets  {
			height: 66px;
			display: inline-block;
		}
			.carousel #bullets li {
				display: inline-block;
				width: 22px;
				height: 22px;
				margin: 0 5px; 
				background: url("../Images/carousel.sprite.png") -150px -300px no-repeat;
			}
			.carousel #bullets .current {
				background-position: -150px -350px;
			}